<template>
  <el-dialog :visible.sync="dialogAddVisible"
             append-to-body
             :close-on-click-modal="false"
             width="320px"
             :before-close="closeDialog"
             :title="type == 'add'?'新增·送样地点':'编辑·送样地点'">
    <div class="csstop">
        <div class="cssborder"></div>
        <div class="cssborder2"></div>
        <div class="cssborder3"></div>
    </div>
    <el-form ref="dataForm"
             :rules="rules"
             :model="levelObj"
             label-position="left"
             size="mini"
             >
      <el-divider></el-divider>
        <el-form-item prop="itemName"  style="margin-bottom: 10px">
      	<span class="span_colon">地点名称</span><i class="i_colon">：</i>
          <el-input clearable  v-model="levelObj.itemName"
                    size="mini"
                    style="width: 160px" />
        </el-form-item>
    </el-form>
    <div slot="footer"
         class="dialog-footer">
      <el-button type="green" class="zll_dialog_bt"
                 size="mini"
                 @click="submitForm">
       提 交
      </el-button>
    </div>
  </el-dialog>
</template>
<script>
  export default {
    props:["editData","type","existLogin"],
    components:{},
    data(){
      var validateName= (rule, value, callback) => {
        let names = [];
        if(this.tableData && this.tableData.length > 0){
          for(let data of this.tableData){
            names.push(data.itemName);
          }
        }
        if (names.includes(this.levelObj.itemName)) {
          callback(new Error('名称已存在!'));
        } else {
          callback();
        }
      };
      return{
        count: 0,
        tableData:[],
        dialogAddVisible:false,
        levelObj:{itemName:"",itemCode: "location"},
        rules: {
          itemName: [
            {validator: validateName, trigger: 'blur'}
          ]
        },
      }
    },
    mounted(){
      this.getList()
    },
    methods:{
      resetForm() {
        this.$refs["dataForm"].clearValidate();
        this.closeDialog();
      },
      //关闭弹窗
      closeDialog() {
        this.$refs['dataForm'].clearValidate();
        this.dialogAddVisible = false;
      },
      getList() {
        let self = this;
          self.tableLoading = true;
          self.$http({
            url: "/drug/codeItem/queryCodeItemList",
            method: "post",
            params: {itemCode: "location"}
          }).then(resp => {
          if (resp.success) {
              self.tableData = resp.result;
            }
          });
      },
      submitForm() {
        let self = this;
        if(!self.levelObj.itemName){
          this.$notify({
            title: '提示',
            message: '提交的选项不能为空',
            type: 'error',
            duration: 1000
          });
          return;
        }
        self.$refs["dataForm"].validate((valid) => {
          if (valid) {
            self.operaLevel();

          } else {
            return false;
          }
        });
      },
      operaLevel() {
        let self = this;
        if (self.count == 0) {
          self.levelObj.userId = self.$store.getters.userId;
          self.$http({
            url: "/drug/codeItem/addCodeItem",
            method: "post",
            params: self.levelObj
          }).then(resp => {
            if (resp.success) {
              self.$eventBus.$emit("updateLevelObj");
              self.$notify({
                title: '提示',
                message: "操作成功！",
                type: 'success'
              });
              self.resetForm('dataForm');
              self.getList()
              return
            }
            self.$notify({
              title: '提示',
              message: "出现异常！请重试",
              type: 'error'
            });
            self.count--;
          });
          self.count++;
        }
      }
    },
    watch:{
      editData(val){
        this.dialogAddVisible = true;
        this.levelObj = val;
        this.copyData = Object.assign({},val);
      }
    }
  }
</script>
<style lang="scss" scoped>
  .el-form-no {
    text-align: right;
    font-size: 18px;
    color: #cb0000;
  }

  .el-button {
    .svg-icon {
      width: 16px;
      height: 16px;
      color: #2995de;
      vertical-align: middle;
      margin-bottom: 2px;
    }
  }

  .el-dialog-item .el-button--mini {
    padding: 0px;
  }

  .el-dialog {
    .el-button .svg-icon {
      width: 18px;
      height: 18px;
      vertical-align: middle;
      margin-bottom: 2px;
    }
  }
</style>
